<template>
  <div>
    <header class="header">
      <div class="title">
        <!-- <router-link to="/xqda"> -->
        <img src="../../assets/images/01_11.png" alt class="img_zuo" @click="fanhui_btn" />
        <div>监督检查计划</div>
      </div>
    </header>
    <div class="main">
      <div class="table_div">
        <div class="item">
          <div class="item_title">{{dataObj.SelectSuper.mc}}</div>
          <div class="item_subtitle">
            <div>计划对象</div>
            <div>计划月份</div>
            <div>落实状态</div>
          </div>
          <div class="item_subtitle">
            <div>{{dataObj.SelectSuper.enterpriseName}}</div>
            <div>{{dataObj.SelectSuper.month}}</div>
            <div>
              <img v-show="wwc_flag" src="../../assets/images/jg.gif" class="img_h" />
            </div>
          </div>
          <div class="item_title">落实情况</div>
          <div class="item_item" v-for="(item,index) of dataObj.List" :key="index" @click="btn(item)">
            <div>{{parseMonth(item.month)}}</div>
            <div>
              <img v-show="item.name||item.name===0" src="../../assets/images/r_b.png" alt="" class="img_rb">
              &nbsp;
              <div>{{item.name}}</div>
              <div style="margin-left: 0.7408rem;">{{item.time}}</div>
            </div>
            <div>
              {{checkNull(item.name)&&isOldMonth(item.month)?'未落实':''}}
            </div>
          </div>
        </div>
      </div>
    </div>

  </div>
</template>
<script>
  export default {
    name: "jdjc_jcdx",//检查对象
    data() {
      return {
        jdjc_jcdx_params:{},
        dataObj:{
          SelectSuper:{},
          List:[]
        },
        wwc_flag:false
      }
    },
    methods: {
      fanhui_btn() {
        this.$router.back()
      },
      btn(item){
        if(!(item.name||item.name===0)){
          return;
        }
        var luoshi_params = {
          title:this.dataObj.SelectSuper.mc,
          id:this.dataObj.SelectSuper.id,
          enterpriseId:this.dataObj.SelectSuper.enterpriseId,
          month:item.month,
          type:this.jdjc_jcdx_params.type
        };
        sessionStorage.setItem("luoshi_params", JSON.stringify(luoshi_params));
        this.$router.push("/luoshi_list");
      },
      checkNull(value){//检测是否为空
        if(value||value===0||value==='0'){
          return false;
        }else{
          return true;
        }
      },
      parseMonth(month){
        var str = '';
        if(month){
          str = (month*1)+'月';
        }
        return str;
      },
      isOldMonth(month){
        var result = false;
        if(month||month===0){
          month = month*1;
        }else{
          month = 0;
        }
        var now = new Date();
        if(month<(now.getMonth()+1)){
          result = true;
        }
        return result;
      },
      getData(){
        var _this = this;
        var url = '/SupervisionExamine/selectSupervisionById';
        var params = {
            id:_this.jdjc_jcdx_params.id,
            unitsId:_this.jdjc_jcdx_params.roomId,
            type:_this.jdjc_jcdx_params.type,
            userId:_this.userId
        };
        _this.axios.get(_this.$global_msg.Url.host + url,{ params }).then(res => {
          console.log(res)
          if(res.data.code==200){
            if(!res.data.rows){
              res.data.rows = {};
              _this.$toast('暂无数据');
            }
            if(!res.data.rows.SelectSuper){
              res.data.rows.SelectSuper = {};
            }
            //总月份显示转换
            if(res.data.rows.SelectSuper.month){
              var months = res.data.rows.SelectSuper.month.split(',');
              var monthStr = '';
              for(var n=0;n<months.length;n++){
                if(months[n]){
                  monthStr+=_this.parseMonth(months[n])+'、';
                }
              }
              if(monthStr){
                monthStr=monthStr.substring(0,monthStr.length-1);
              }
              res.data.rows.SelectSuper.month = monthStr;
            }
            if(!(res.data.rows.List&&res.data.rows.List.length>0)){
              res.data.rows.List = [];
            }
            _this.dataObj = res.data.rows;
          }else{
            _this.$toast(res.data.msg);
            _this.dataObj = {
              SelectSuper:{},
              List:[]
            }
          }
          try {
            plus.nativeUI.closeWaiting();
          } catch (e) {
            console.log('plus问题');
          }
        }).catch(err=>{
             this.$terminal._error(err)
          })
      }
    },
    mounted() {
      var _this = this;
      this.userId = localStorage.getItem('userId')
      this.jdjc_jcdx_params = localStorage.getItem("jdjc_jcdx_params")?JSON.parse(localStorage.getItem("jdjc_jcdx_params")):{};
      document.body.style.background = "#FFFFFF";
      this.getData();
      var list_light = localStorage.getItem("list_light");
      _this.wwc_flag = list_light=='未完成'?true:false;
    }

  }
</script>
<style scoped>
  /* 头部开始 */
  .header {
    height: 1.8519rem;
    background: #007aff;
    padding-top: 0.8333rem;
    box-sizing: border-box;
    position: fixed;
    width: 100%;
    top: 0;
    z-index: 20;
    font-size: 0.388888rem;
  }

  .title {
    padding: 0 0.3704rem;
    display: flex;
    align-items: center;
    color: #fff;
  }

  .btn-change {
    position: absolute;
    left: 1.537037rem;
    font-size: 0.488888rem !important;
    bottom: 0px;
    top: 0.15rem;
    width: auto !important;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }

  .title>div {
    width: 100%;
    font-size: 0.4444rem;
    text-align: center;
  }

  .img_zuo {
    width: 0.2593rem;
    height: 0.463rem;
  }

  /* 头部结束 */
  .main {
    width: 100%;
    height: 100vh;
    overflow-y: auto;
    padding: 0.1852rem;
    padding-top: 2.037rem;
    box-sizing: border-box;
  }

  .table_div {
    width: 100%;
    overflow: hidden;
    border-radius: 0.1852rem;
    background: #7AC0FE;

  }

  .item_title {
    height: 1.1111rem;
    text-align: center;
    line-height: 1.1111rem;
    color: #fff;
    border-bottom: 1Px solid #fff;
  }

  .item_subtitle {
    display: flex;
    height: 1.1111rem;
    align-items: center;
    border-bottom: 1Px solid #fff;
    color: #fff;
  }

  .item_subtitle>div:nth-child(1) {
    width: 2.7778rem;
    padding-left: 0.1852rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .item_subtitle>div:nth-child(2) {
    flex: 1;
    border-left: 1Px solid #fff;
    border-right: 1Px solid #fff;
    align-items: center;
    display: flex;
    height: 100%;
    padding-left: 0.1852rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .item_subtitle>div:nth-child(3) {
    width: 1.8rem;
    text-align: center;

  }

  .img_h {
    width: 0.6rem;
    margin: auto;
  }

  .item_item {
    display: flex;
    height: 1.1111rem;
    align-items: center;
    color: #fff;
    border-bottom: 1Px solid #fff;
  }

  .item_item>div:nth-child(1) {
    width: 1.2889rem;
    padding-right: 0.2852rem;
    text-align: right;
  }

  .item_item>div:nth-child(3) {
    width: 1.8rem;
    text-align: center;
  }

  .item_item>div:nth-child(2) {
    flex: 1;
    border-left: 1Px solid #fff;
    border-right: 1Px solid #fff;
    align-items: center;
    display: flex;
    height: 100%;
    padding-left: 0.1852rem;
  }
  .img_rb{
    width: 0.3889rem;
    height: 0.3889rem;
  }
</style>
